<template>
  <div>
    <!-- 招贤纳士 -->
    <page-dec>
      <template v-slot:DescName>{{ viewDesc.chineseName }}</template>
      <template v-slot:DescContent>{{ viewDesc.text }}</template>
    </page-dec>
    <div class="introduce-ontent">
      <div class="enterprise" v-for="item in initData" :key="item.id">
        <!-- 放置图片 -->
        <div class="epimg">
          <img :src="item.image" alt="" />
        </div>
        <!-- 右边的文字 -->
        <div class="eptext">
          <!-- 标题 -->
          <div class="eptitle">{{ item.name }}</div>
          <!-- 内容 -->
          <div class="epcontent">{{ item.desc1 }}</div>
          <div class="epcontent">{{ item.desc2 }}</div>
        </div>
      </div>
    </div>
  </div>
</template>

<script>
import pageDec from "@/components/pageDec.vue";
// import axios from "axios";
export default {
  components: {
    pageDec,
  },
  data() {
    return {
      viewDesc:{},
      initData: [],
    };
  },
  created() {
    this.createData();
  },
  methods: {
    //  页面数据获取
    async createData() {
      const { data: res } = await this.$axios.get("/OfficialWebsite/getPageOfJoinUs");
      if (res.code === 200) {
        this.viewDesc = res.data.viewDesc
        this.initData = res.data.department
        console.log('jionUS',res.data);
      }else{
        return false
      }
    },
  },
};
</script>

<style lang="scss" scoped>
.introduce-ontent {
  background-color: #f5fbff;
  padding-top: 5rem;
  .enterprise {
    width: 100%;
    height: 26.875rem;
    margin-top: 5rem;
    display: flex;
    .epimg {
      width: 26.875rem;
      height: 26.875rem;
      margin-left: 3.125rem;
      line-height: 26.875rem;
      background-color: #fff;
      border-radius: 0.9375rem;
      img {
        width: 100%;
        vertical-align: middle;
      }
    }
    .eptext {
      width: 50%;
      word-break: break-all;
      margin-left: 2.5rem;
      .eptitle {
        margin-top: 1.25rem;
        font-size: 3rem;
      }
      .epcontent {
        margin-top: 1.25rem;
        font-size: 1.125rem;
      }
    }
  }
  .enterprise:first-of-type {
    margin-top: 0;
  }
}
</style>
